'use client'

export default function Info() {
  return (
    <div className="w-full text-white rounded-xl flex flex-col md:flex-row md:items-center md:justify-between gap-6 shadow-lg border border-[#1f2533]">
      {/* 左侧信息 */}
      <div className="flex items-start gap-5">
        {/* 图标方块 */}
        <div className="dashlogo w-[120px] h-[98px] rounded-xl bg-gradient-to-br from-[#141a25] to-[#1b2231] border border-[#2a3142] flex items-center justify-center text-2xl font-bold text-[#b8c1d9]">
          TA
        </div>

        {/* 标题与详情 */}
        <div className="flex flex-col justify-center">
          <div className=" mt-[8px] text-[20px] text-[#e7ecf3] font-semibold">Tapplock Deal Report</div>

          <div className="mt-[12px] text-[13px] text-[#9aa3b2]">
            Access Control / Security <span className="text-[#9aa3b2]/30">•</span> Hardware + SaaS{' '}
            <span className="mx-[2px] text-[#9aa3b2]/30 ">•</span> Toronto, Canada{' '}
            <span className="mx-[2px] text-[#9aa3b2]/30">•</span> Analyzed{' '}
            <span className="text-[#9aa3b2]">2025年10月30日</span>
          </div>

          {/* 芯片信息 */}
          <div className="flex flex-wrap gap-2 mt-2">
            <span className="text-[12px] text-[#e7ecf3] bg-[#1b2030] border border-[#2a3142] rounded-full px-3 py-1">
              <strong className="text-[12px] text-[#e7ecf3] mr-1">Round:</strong> Seed / Pre-A
            </span>
            <span className="text-[12px] text-[#e7ecf3] bg-[#1b2030] border border-[#2a3142] rounded-full px-3 py-1">
              <strong className="text-[12px] text-[#e7ecf3] mr-1">Amount:</strong> $1M USD
            </span>
            <span className="text-[12px] text-[#e7ecf3] bg-[#1b2030] border border-[#2a3142] rounded-full px-3 py-1">
              <strong className="text-[12px] text-[#e7ecf3] mr-1">Valuation:</strong> N/A
            </span>
          </div>
        </div>
      </div>

      {/* 右侧状态标签 */}
      <div className="flex items-center justify-end">
        <div className="text-[15px]  flex items-center gap-2 bg-gradient-to-r from-[#141a25] to-[#1b2030] border-solid border-[#2a3142] py-[10px] px-[16px] rounded-full  shadow-md">
          <span className="w-2.5 h-2.5 bg-yellow-400 rounded-full animate-pulse" />
          <span className="leading-[1.5] font-semibold">Cautiously Optimistic</span>
        </div>
      </div>
    </div>
  )
}
